<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>

<body>
  <!-- 我是注释,哈哈哈哈哈 -->
  我是文本,呵呵呵

  <div class="box">哈哈哈哈哈</div>
  <ul>
    <li>1</li>
    <li>2</li>
    <li>3</li>
    <li>4</li>
    <li>5</li>
  </ul>
  <script>

    // var htmlEl = document.documentElement
    // var headEl = document.head
    // var bodyEl = document.body
    // var doctype = document.doctype
    // console.log(htmlEl,headEl,bodyEl,doctype)

    // 1.获取节点导航
    var bodyEl = document.body
    // 1.1 获取所有的子节点
    console.log(bodyEl.childNodes)

    var text = bodyEl.firstChild

    var comment = text.nextSibling

    var html = bodyEl.parentElement
  </script>
</body>

</html>